<!DOCTYPE html>
<html lang="ru-RU">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">	
        <meta name="keywords" content="">
        <meta name="description" content="">
        <meta name="author" content="Trumplin.net Dev Team">
        <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, maximum-scale=1.0">
        <meta name="HandheldFriendly" content="True">
        <title></title>
        <link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic&amp;subset=latin,cyrillic' rel='stylesheet' type='text/css'>
        <link href='http://fonts.googleapis.com/css?family=Istok+Web:400,400italic,700,700italic&amp;subset=latin,cyrillic' rel='stylesheet' type='text/css'>
        <link href="/adminarea/css/styles.css" rel="stylesheet" type="text/css">
        <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script src="/adminarea/js/amcharts.js" type="text/javascript"></script>
        <script src="/adminarea/js/serial.js" type="text/javascript"></script>
        <script type="text/javascript">
            function handleHeight() {
                var h = $(document).height();
                var h1 = $("#left-sidebar").height();
                h = h - 40;
                h1 = h1 - 40;
                if (h <= h1) {
                    $("#main-content").css("height", h1);
                } else
                {
                    $("#main-content").css("height", "100%");
                }
            }
        </script>	
        <script type="text/javascript">
            $(function() {
                $("#no-js-warning").addClass("hidden");
                handleHeight();
                var n = navigator.appVersion;
                var p = n.indexOf("WebKit");
                if (p >= 0) {
                    $("div.select-style").addClass("webkiteng");
                }
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $(window).resize(function() {
                    handleHeight();
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $(window).keydown(function() {
                    handleHeight();
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $(window).click(function() {
                    handleHeight();
                });
            });
        </script>
        <script>
            $(function() {
                var a = $("span.unread-items-count-text");
                var b = a.parent();
                var c = a.text();
                if ($.trim(c) == "0") {
                    b.addClass("hidden");
                } else {
                    if ($.trim(c) == "") {
                        b.addClass("hidden");
                    }
                }
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("#admin-area-sidebar-nav li a").hover(function() {
                    var a = $(this).find("img");
                    var b = a.attr("class");
                    var c = b + "-hovered";
                    a.removeClass(b);
                    a.addClass(c);
                }, function() {
                    var a = $(this).find("img");
                    var b = a.attr("class");
                    var c = b.replace("-hovered", "");
                    a.removeClass(b);
                    a.addClass(c);
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("select").focus(function() {
                    var a = $(this).parent();
                    a.addClass("select-focused");
                });
                $("select").focusout(function() {
                    var a = $(this).parent();
                    a.removeClass("select-focused");
                });
            });
        </script>
        <script type="text/javascript">
            AmCharts.monthNames = ['Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'];
            AmCharts.shortMonthNames = ['Янв', 'Фев', 'Мар', 'Апр', 'Май', 'Июн', 'Июл', 'Авг', 'Сен', 'Окт', 'Ноя', 'Дек'];
            AmCharts.dayNames = ['Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Суббота', 'Воскресенье'];
            AmCharts.shortDayNames = ['Пон', 'Вт', 'Ср', 'Чет', 'Пят', 'Суб', 'Вос'];
            var chart;
            var chartData = [{
                    date: "01.03.2014",
                    cost: "5.0"
                }, {
                    date: "02.03.2014",
                    cost: "22.0"
                }, {
                    date: "03.03.2014",
                    cost: "32.5"
                }, {
                    date: "04.03.2014",
                    cost: "15"
                }, {
                    date: "05.03.2014",
                    cost: "10.2"
                }, {
                    date: "06.03.2014",
                    cost: "21.5"
                }, {
                    date: "07.03.2014",
                    cost: "24.2"
                }, {
                    date: "08.03.2014",
                    cost: "20.5"
                }, {
                    date: "09.03.2014",
                    cost: "10.33"
                }, {
                    date: "10.03.2014",
                    cost: "40.3"
                }];

            // this method is called when chart is first inited as we listen for "dataUpdated" event
            function zoomChart() {
                // different zoom methods can be used - zoomToIndexes, zoomToDates, zoomToCategoryValues
                //chart.zoomToIndexes(0, chart.dataProvider.length);
            }

            // create chart
            AmCharts.ready(function() {

                // SERIAL CHART    
                chart = new AmCharts.AmSerialChart();

                chart.marginTop = 0;
                chart.marginLeft = 0;
                chart.autoMarginOffset = 0;
                chart.pathToImages = "http://www.amcharts.com/lib/3/images/";
                chart.zoomOutButton = {
                    backgroundColor: '#000000',
                    backgroundAlpha: 0.15
                };
                chart.dataDateFormat = "DD.MM.YYYY";
                chart.dataProvider = chartData;
                chart.categoryField = "date";

                // listen for "dataUpdated" event (fired when chart is inited) and call zoomChart method when it happens
                chart.addListener("dataUpdated", zoomChart);

                // AXES
                // category                
                var categoryAxis = chart.categoryAxis;
                categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true
                categoryAxis.minPeriod = "DD"; // our data is daily, so we set minPeriod to DD
                categoryAxis.dashLength = 1;
                categoryAxis.gridAlpha = 0.15;
                //categoryAxis.axisColor = "#DADADA";
                categoryAxis.position = "top";
                categoryAxis.minorGridEnabled = true;


                // first value axis (on the left)
                var valueAxis1 = new AmCharts.ValueAxis();
                //valueAxis1.axisColor = "#FF6600";
                //valueAxis1.axisThickness = 0;
                //valueAxis1.gridAlpha = 0.15;	
                chart.addValueAxis(valueAxis1);

                // GRAPHS
                // first graph
                var graph1 = new AmCharts.AmGraph();
                graph1.valueAxis = valueAxis1; // we have to indicate which value axis should be used
                graph1.title = "Промокод #5465";
                graph1.valueField = "cost";
                graph1.bullet = "round";
                graph1.hideBulletsCount = 10;
                graph1.bulletBorderAlpha = 1;
                graph1.bulletSize = 6;
                graph1.lineThickness = 2;
                graph1.bulletColor = "#FFF";
                graph1.bulletBorderColor = "#FFBA00";
                graph1.lineColor = "#FFBA00";
                graph1.balloonText = "$[[value]]";
                chart.addGraph(graph1);

                // CURSOR
                var chartCursor = new AmCharts.ChartCursor();
                chartCursor.cursorPosition = "mouse";
                chart.addChartCursor(chartCursor);

                // SCROLLBAR
                //var chartScrollbar = new AmCharts.ChartScrollbar();
                //chartScrollbar.scrollbarHeight = 25;
                //chart.addChartScrollbar(chartScrollbar);

                // LEGEND
                var legend = new AmCharts.AmLegend();
                legend.marginLeft = 0;
                legend.position = "bottom";
                legend.align = "center";
                legend.valueAlign = "left";
                chart.addLegend(legend);

                // WRITE
                chart.write("chartdiv");
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("input[type=button].calendar-button").click(function() {
                    $("#date-popup").removeClass("hidden");
                    var h = $(window).height();
                    var w = $("#main-content").width();
                    var h1 = $("#date-popup").height();
                    var w1 = $("#date-popup").width();
                    var a = $(window).width();
                    if (a >= 980) {
                        var w2 = $("#left-sidebar").width();
                        w += 40;
                        w2 += 40; //40-padding 20px
                        $("#date-popup").css("top", h / 2 - h1 / 2);
                        $("#date-popup").css("left", (w / 2 - w1 / 2) + w2);
                    } else {
                        $("#date-popup").css("top", h / 2 - h1 / 2);
                        $("#date-popup").css("left", w / 2 - w1 / 2);
                    }
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("select[name=promocode-id]").change(function() {
                    var a = $("#range-text").val();
                    if ($.trim(a) != "") {
                        $("form[name=admin-area-users-form]").submit();
                    }
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("#date-range-selector").click(function() {
                    var a = $("#popup-tabs-contents li div.active-tab-item input[name=start-range]");
                    var b = $("#popup-tabs-contents li div.active-tab-item input[name=finish-range]");
                    $("input.calendar-button").val(a.val() + " — " + b.val());
                    $("#range-text").val(a.val() + " — " + b.val());
                    $("#date-popup").addClass("hidden");
                    var c = $("select[name=promocode-id]").find("option:selected").val();
                    var d = $("select[name=promocode-id] option:first-child").val();
                    if (c != d) {
                        $("form[name=admin-area-users-form]").submit();
                    }
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("select[name=group-by]").change(function() {
                    var a = $("#range-text").val();
                    if ($.trim(a) != "") {
                        var b = $("select[name=promocode-id]").find("option:selected").val();
                        var c = $("select[name=promocode-id] option:first-child").val();
                        if (b != c) {
                            $("form[name=admin-area-users-form]").submit();
                        }
                    }
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("#close-popup").click(function() {
                    $("#date-popup").addClass("hidden");
                });
            });
        </script>
        <script type="text/javascript">
            $(document).keydown(function(e) {
                if (e.keyCode == 27) {
                    var a = $("#date-popup").hasClass("hidden");
                    if (a == false) {
                        $("#date-popup").addClass("hidden");
                    }
                }
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("#popup-tabs-head li").click(function() {
                    $("#popup-tabs-head li").removeClass("active-tab-item");
                    $(this).addClass("active-tab-item");
                    $("#popup-tabs-contents li div").removeClass("hidden");
                    $("#popup-tabs-contents li div").addClass("hidden");
                    var a = $(this).find("span");
                    var b = a.attr("id");
                    var c = $("#popup-tabs-contents li div." + b);
                    c.removeClass("hidden");
                    $("#popup-tabs-contents li div").removeClass("active-tab-item");
                    c.addClass("active-tab-item");
                });
            });
        </script>
        <script type="text/javascript">
            $(function() {
                $("input[name=start-range]").keypress(function(e) {
                    var ca = new Array(46, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57);
                    var c = !e.charCode ? e.which : e.charCode;
                    if ($.inArray(c, ca) !== -1) {
                    } else {
                        e.preventDefault();
                    }
                });
                $("input[name=finish-range]").keypress(function(e) {
                    var ca = new Array(46, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57);
                    var c = !e.charCode ? e.which : e.charCode;
                    if ($.inArray(c, ca) !== -1) {
                    } else {
                        e.preventDefault();
                    }
                });
            });
        </script>
        <script type="text/javascript">
            function resetTableView() {
                $("table.admin-area-table tr.extracted").each(function() {
                    if ($(this).attr("id")) {
                        $(this).removeClass("extracted");
                    } else {
                        $(this).addClass("hidden");
                        $(this).removeClass("extracted");
                    }
                });
            }
        </script>
        <script type="text/javascript">
            $(function() {
                $("img.eye-action").click(function() {
                    var a = $(this).parent().parent().parent();
                    var b = a.attr("id");
                    var c = a.parent();
                    var d = c.find("tr." + b);
                    if (d.hasClass("hidden")) {
                        resetTableView();
                        d.removeClass("hidden");
                        d.addClass("extracted");
                        a.addClass("extracted");
                    } else {
                        d.addClass("hidden");
                        d.removeClass("extracted");
                        a.removeClass("extracted");
                    }
                });
            });
        </script>
    </head>
    <body>
        <div id="date-popup" class="hidden">
            <div id="date-popup-inner">
                <div id="date-popup-inner-header">
                    <img id="close-popup" src="/adminarea/img/icon.png">
                </div>
                <div id="date-popup-content">
                    <p>Укажите период</p>
                    <ul id="popup-tabs-head">
                        <li>
                            <span id="tab-range-week">Неделя</span>
                        </li>
                        <li class="active-tab-item">
                            <span id="tab-range-month">Месяц</span>
                        </li>
                        <li>
                            <span id="tab-range-quartal">Квартал</span>
                        </li>
                        <li>
                            <span id="tab-range-year">Год</span>
                        </li>	
                    </ul>
                    <ul id="popup-tabs-contents">
                        <li>
                            <div class="hidden tab-range-week">
                                <input type="text" class="text-field" name="start-range" value="17.03.2014"><span>&mdash;</span><input type="text" class="text-field" name="finish-range" value="24.03.2014">
                            </div>
                        </li>
                        <li>
                            <div class="active-tab-item tab-range-month">
                                <input type="text" class="text-field" name="start-range" value="24.02.2014"><span>&mdash;</span><input type="text" class="text-field" name="finish-range" value="24.03.2014">
                            </div>
                        </li>
                        <li>
                            <div class="hidden tab-range-quartal">
                                <input type="text" class="text-field" name="start-range" value="24.12.2013"><span>&mdash;</span><input type="text" class="text-field" name="finish-range" value="24.03.2014">
                            </div>
                        </li>
                        <li>
                            <div class="hidden tab-range-year">
                                <input type="text" class="text-field" name="start-range" value="24.03.2013"><span>&mdash;</span><input type="text" class="text-field" name="finish-range" value="24.03.2014">
                            </div>
                        </li>
                    </ul>
                    <div class="clear"></div>
                </div>
                <div id="date-popup-inner-footer">
                    <button id="date-range-selector" class="single-button">Выбрать</button>
                </div>
            </div>
        </div>
        <div id="wrapper">
            <div id="no-js-warning"><p>Внимание! Ваш браузер не поддерживает JavaScript либо данная возможность отключена. Настоятельно рекомендуется исправить ситуацию для корректного отображения сайта.</p></div>
            <div id="left-sidebar">
                <a href="http://towing.su"><img id="logo" src="/adminarea/img/adminlogo.png" alt="Главная" title="Главная"></a>
                <ul id="admin-area-sidebar-nav">
                    <li>
                        <a href="/adminarea/index.html"><img class="icon-1" src="/adminarea/img/icon.png"><span>Главная</span></a><span class="unread-items"><span class="unread-items-count"><span class="unread-items-count-text">1</span></span></span>
                    </li>
                    <li>
                        <a href="/adminarea/news.html"><img class="icon-2" src="/adminarea/img/icon.png"><span>Новости</span></a>
                    </li>				
                    <li>
                        <a href="/adminarea/statistics.html"><img class="icon-3" src="/adminarea/img/icon.png"><span>Расходы пользователей</span></a>
                    </li>
                    <li>
                        <a href="/adminarea/promocodes.html"><img class="icon-4" src="/adminarea/img/icon.png"><span>Промокоды</span></a>
                    </li>
                    <li>
                        <a href="/adminarea/usersfunds.html"><img class="icon-5" src="/adminarea/img/icon.png"><span>Пополнения счета</span></a>
                    </li>
                    <li>
                        <a href="/adminarea/users.html" class="active-item"><img class="icon-6" src="/adminarea/img/icon.png"><span>Пользователи</span></a>
                    </li>
                    <li>
                        <a href="/adminarea/cities.html"><img class="icon-7" src="/adminarea/img/icon.png"><span>Города</span></a>
                    </li>
                    <li>
                        <a href="/adminarea/?logout"><img class="icon-8" src="/adminarea/img/icon.png"><span>Выйти</span></a>
                    </li>
                </ul>
                <div class="clear"></div>
                <p id="admin-area-sidebar-balance">На Вашем балансе <span>$242,45</span></p>			
            </div>
            <div id="main-content">
                <h1>Пользователи системы</h1>
                <p>На этой странице вы можете просмотривать все добавленные вами эвакуаторы, у каждого есть свой статус и так далее На этой странице вы можете просмотривать все добавленные вами эвакуаторы, у каждого есть свой статус и так далее. На этой странице вы можете просмотривать все добавленные вами эвакуаторы, у каждого есть свой статус и так далее.</p>
                <div id="content-inner">
                    <form enctype="multipart/form-data" action="" method="get" name="admin-area-users-form">
                        <div id="content-inner-top">
                            <span class="in-row">Показать</span>
                            <div class="select-style w126px to-left">
                                <select name="promocode-id" class="select-styled w146px">
                                    <option selected disabled>Промокод</option>
                                    <option value="5465">5465</option>
                                    <option value="2465">2465</option>
                                    <option value="2794">2794</option>								
                                </select>														
                            </div>						
                            <span class="in-row">за период</span>
                            <div class="field-outer">
                                <img src="/adminarea/img/icon.png"><input type="button" class="single-button calendar-button" value="24.02.2013 — 24.03.2014"><input id="range-text" type="text" name="range" value="24.02.2013 — 24.03.2014" class="hidden">
                            </div>
                            <span class="in-row">и сгруппировать по</span>
                            <div class="select-style w106px to-left">
                                <select name="group-by" class="select-styled w126px">
                                    <option value="days">Дням</option>
                                    <option value="weeks">Неделям</option>
                                    <option value="months" selected>Месяцам</option>
                                </select>														
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div id="chartdiv"></div>
                        <table class="admin-area-table">
                            <thead>
                                <tr>
                                    <th><div class="title mid-cell"><p>Промокод</p></div></th>
                            <th><div class="title mid-cell"><p>Эвакуаторов</p></div></th>
                            <th><div class="title mid-cell"><p>Фамилия</p></div></th>
                            <th><div class="title mid-cell"><p>Регистрация</p></div></th>
                            <th><div class="title mid-cell"><p>E-mail пользователя</p></div></th>
                            <th><div class="title"><img class="eye-action-head" src="/adminarea/img/icon.png"></div></th>
                            </tr>					
                            </thead>
                            <tbody>
                                <tr id="table-row-0">								
                                    <td><div class="cell mid-cell"><p class="promocode-id">5465</p></div></td>
                                    <td><div class="cell short-cell"><p>1</p></div></td>
                                    <td><div class="cell mid-cell"><p>Дворецкий</p></div></td>
                                    <td><div class="cell mid-cell"><p>24.12.2013</p></div></td>
                                    <td><div class="cell mid-cell"><p>blablabla@gmail.com</p></div></td>
                                    <td><div class="cell"><img class="eye-action" src="/adminarea/img/icon.png"></div></td>
                                </tr>
                                <tr class="hidden table-row-0">
                                    <td colspan="6">
                                        <div class="extended-row-inner row-full-length">
                                            <div class="extended-row-inner-content">
                                                <div>	
                                                    <p>Телефон: 7 (850) 784-45-54</p>
                                                </div>
                                                <div>
                                                    <p>Пароль: vjdleoD3j</p>
                                                </div>
                                                <div>
                                                    <p>Имя: Иван</p>
                                                </div>
                                            </div>
                                            <div class="extended-row-inner-footer">
                                                <a class="single-button" href="users.html?action=remove&id=5465">Удалить</a>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </form>
                </div>	
            </div>
        </div>
    </body>
</html>